@import 'src/@notadd/scss/notadd';

.nav-panel{
    background-color: #FFF;
    margin-top: 25px;
    min-height: 430px;
    min-width: 800px;

    @include media-breakpoint('xs') {
        height: 430px;
        min-width: 338px;
    }

    &>.mat-nav-list {
        height: 100%;
        padding: 20px 0;
        border-right: 1px solid #e0e0e0;

        .mat-list-item {
            font-size: 14px;
            width: 140px;

            &.active {
                border-right: 2px solid #1e88e5;
            }
        }
    }

    .nav-container {
        padding: 20px;

        @include media-breakpoint('xs') {
            height: 100%;
            overflow: auto;
        }

        .mat-nav-list {
            min-width: 140px;
            overflow: hidden;

            @include media-breakpoint('xs') {
                min-width: 155px;
            }

            .list-title {
                padding: 5px 0 8px 0;
            }

            .mat-list-item {
                height: 30px;
                text-align: left;
                font-size: 14px;
                color: #757575;

                &.active {
                    color: #1e88e5;
                }

                &:hover {
                    text-decoration: none;
                }

                .mat-list-item-content {
                    padding: 0;
                }
            }
        }
    }
}
